<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        table {
            width: 100%;
            text-align: center;
            border-collapse: collapse;
            border: 1px solid #ccc;
        }

        th, td {
            text-align: center;
            border: 1px solid #ccc;
        }
    </style>
</head>
<body>
<table>
    <thead>
    <tr>
        <th>商品名称</th>
        <th>商品价格</th>
        <th>商品数量</th>
        <th>总价</th>
        <th>收获地址</th>
    </tr>
    </thead>

    <tbody>
    <tr>

    </tr>
    </tbody>
</table>
<script>
    // 获取数据
    const goodsName = prompt("请输入商品名称")
    const goodsPrice = parseFloat(prompt("请输入商品价格"))
    const goodsCount = parseInt(prompt("请输入商品数量"))
    const address = prompt("请输入收获地址")
    // 计算总额
    const totalPrice = goodsPrice * goodsCount

    // 存储商品信息的数组
    const arr = []
    // 往数组里添加元素
    arr.push(goodsName, goodsPrice, goodsCount, totalPrice, address,)

    for (let i = 0; i < arr.length; i++) {
        const td = document.createElement("td")
        td.innerHTML = arr[i]
        document.querySelector("tbody tr").appendChild(td)
    }
</script>
</body>
</html>